import React from 'react'
import {Layout,Menu,Popconfirm} from 'antd'
import {useNavigate} from 'react-router-dom'
const {Header}=Layout

export default function MyHeader() {
  const nav=useNavigate()
  const lagout=()=>{
    localStorage.removeItem('token')
    localStorage.removeItem('userInfo')
    nav("/login",{replace:true})
  }
  return (
    <Header className='header-container'>
        <div className='login'>蜗牛商城后台管理系统</div>
        <Menu className='setup' mode="horizontal" theme="dark">
            <Menu.Item>个人中心</Menu.Item>
            <Popconfirm 
                placement="topLeft" 
                title={"您确定要退出系统吗?"} 
                onConfirm={lagout} 
                okText="确定" 
                cancelText="取消">
              <Menu.Item>安全退出</Menu.Item>
            </Popconfirm>
        </Menu>
    </Header>
  )
}
